<template>
    <v-table ref="vTable" :columns="ioColumns" :value="currentValue" readonly></v-table>
</template>

<script type="text/ecmascript-6">
import * as Chef from '../../../core/Chef.js';
import vTable from '../../../utils/v-table.vue';
import bus from '../../../utils/Eventbus.js';

export default {
    name: 'p-vehicle-io-detail',
    components: { vTable },
    props: {
        value: Array
    },
    data () {
        return {
            currentValue: this.value,
            ioColumns: [
                { label: 'INDEX', prop: 'inputIdx', width: 30 },
                { label: 'ASC', prop: 'inputASC', width: 30 },
                { label: 'HEX', prop: 'inputHEX', width: 30 },
                { label: 'DEC', prop: 'inputDEC', width: 30 },
                { label: 'BIN', prop: 'inputBIN', width: 60 },
                { label: 'INDEX', prop: 'outputIdx', width: 30 },
                { label: 'ASC', prop: 'outputASC', width: 30 },
                { label: 'HEX', prop: 'outputHEX', width: 30 },
                { label: 'DEC', prop: 'outputDEC', width: 30 },
                { label: 'BIN', prop: 'outputBIN', width: 60 }
            ]
        };
    },
    watch: {
        value(val) {
            this.currentValue = val;
            bus.emit(this.$refs.vTable.trueName + '.repaint');
        }
    },
    mounted() {
        this.init();
    },
    methods: {
        init() {
        },
        getIOList() {
            return new Promise(resolve => {
                let rtn = { list: [], listCount: 0 };
                rtn.list = Chef.extendVehicleIO(this.currentValue).ioExt;
                resolve(rtn);
            });
        }
    }
};
</script>

<style lang="scss">
.page-vehicle-io-detail {
}
</style>
